<template>
  <div id="app">
    <!--页面级缓存-->
    <transition name="fadeIn">
    <keep-alive>
      <router-view v-if="$route.meta.keepAlive"/>
    </keep-alive>
    </transition>
    <!--不需要缓存的走下面 需要缓存的走上面-->
    <transition name="fadeIn">
      <router-view v-if="!$route.meta.keepAlive"/>
    </transition>

    <Tab></Tab>
  </div>
</template>

<script>
import Tab from './base/Tab.vue';
export default {
  name: 'App',
  components:{
    Tab
  }
}
</script>

<!--这里是公共样式-->
<style>
*{
  margin: 0;padding: 0
}
ul,li{list-style: none}
a{text-decoration: none}
  // 去掉输入框的默认样式
input,button{
  -webkit-appearance:none
}
.swiperContent{
   position: fixed;width: 100%;top: 40px;bottom: 52px;overflow: auto;
}

  /*动画进入*/
  .fadeIn-enter{
    opacity: 0;
  }
/*动画激活*/
  .fadeIn-enter-active{
    transition: all 0.3s linear;
  }
/*动画离开 时间要加单位 */
  .fadeIn-leave-active{
    transition: all 0.3s linear;
    opacity: 0;
  }

</style>
